Skip to content
This repository has been archived by the owner on Apr 12, 2024. It is now read-only.

Removing 'X-Requested-With' from default headers. #1454

Closed
wants to merge 1 commit into from

Conversation

rkirov
Copy link
Contributor

@rkirov rkirov commented Oct 12, 2012

fixes #1004

@petebacondarwin
Copy link
Member

Interestingly jQuery adds this to requests if it is not already set and the request is not cross domain:

From jQuery.js - send function

// X-Requested-With header
// For cross-domain requests, seeing as conditions for a preflight are
// akin to a jigsaw puzzle, we simply never set it to be sure.
// (it can always be set on a per-request basis or even using ajaxSetup)
// For same-domain requests, won't change header if already provided.
if ( !s.crossDomain && !headers["X-Requested-With"] ) {
  headers[ "X-Requested-With" ] = "XMLHttpRequest";
}

Perhaps $http should do the same?

@taralx
Copy link

taralx commented Nov 13, 2012

+1 to this. I get:

XMLHttpRequest cannot load http://[censored]. Request header field X-Requested-With is not allowed by Access-Control-Allow-Headers.

@geddski
Copy link
Contributor

geddski commented Nov 15, 2012

This is easy enough to work around with:

delete $httpProvider.defaults.headers.common['X-Requested-With'];

but I agree it's annoying.

+1

@imjoshholloway
Copy link

You can actually use @GEDDesign's work around using the .config() method:

App.config(['$httpProvider', function($httpProvider) {
    delete $httpProvider.defaults.headers.common["X-Requested-With"]
}]);

@chadhietala
Copy link

I'm using the work around as @imjoshholloway suggests but for some reason the responses are getting canceled. My server is sending a 200 response with the correct length. Not really sure what's going on. Has anyone else experienced this and if so have you found a work around?

@IgorMinar
Copy link
Contributor

I fixed the commit message, added explanation and a breaking change note and landed this as 3a75b11

thanks!

@IgorMinar IgorMinar closed this Nov 26, 2012
@davedx
Copy link
Contributor

davedx commented Feb 17, 2013

Just for the record, I had to use this workaround in the latest version of Angular when trying to get it to talk to Rails. Not very getting-started friendly.

@IgorMinar
Copy link
Contributor

Which workaround? To delete the x-requested-with header or to add it back in?

@davedx
Copy link
Contributor

davedx commented Feb 19, 2013

Deleting it lets $http work with another domain.

Using resources I get the issue again, but deleting the x-requested-with header doesn't fix that, so I guess resource doesn't use $http under the hood, or something else.

I gave up at that point. If I come back to this I'll try to run my API on the same domain, but that's not always possible.

@Sate
Copy link

Sate commented Feb 27, 2013

I too just had to manually delete the "X-Requested-With", but it was because I was using angular seed. Angular seed still has this default header. I just made a pull request to take it out. angular/angular-seed#53

@GulinSS
Copy link

GulinSS commented Feb 27, 2013

Why this header was removed from defaults? Can anybody explain me the reason?

@pkozlowski-opensource
Copy link
Member

@GulinSS I believe that it was removed since it was creating a lot of confusion since it is triggering pre-flight (OPTIONS) requests for the CORS request. It was generating massive number of support questions and confusion among users.

@sirkitree
Copy link

Any idea when this will land in a release?

@patcito
Copy link

patcito commented Apr 17, 2013

I'm still getting the error here with 1.1.4.

This works:

$.post('http://localhost:3000/items', {name: 'foo');

But not that:

$http.post('http://localhost:3000/items', {name: 'foo'})

I get a:

XMLHttpRequest cannot load http://localhost/items. Origin http://localhost:9000 is not allowed by Access-Control-Allow-Origin. localhost/:1

@sharq1
Copy link

sharq1 commented Apr 24, 2013

I'm having the same situation as @patcito - $.post works fine and $http.post sends OPTIONS, which I cannot afford (speed, performance).
The problem is I cannot attach custom headers without $http, so it would be nice to control $http behavior for cross domain requests.

@paulwalker
Copy link

Apparently, the X-Requested-With header is no longer sent with version 1.1.4. Many web frameworks depend upon this header to determine if the request was made via ajax, so it would be nice to instead change the behavior based upon whether the request is Cross Origin or not. Also, the documentation still states it is sent: http://docs.angularjs.org/api/ng.$http

EDIT: Correction: my apologies, I was not aware there was specific documentation version for 1.1.4: http://code.angularjs.org/1.1.4/docs/api/ng.$http

@dturkenk
Copy link

This change definitely breaks making JSON requests to Rails (at least on localhost). Rails is only returning HTML without that header.

It's an easy workaround to force it in, but at a minimum it might be useful to up-level the commit comment to the documentation. Probably better would be what Paul Walker suggested to determine whether the request is cross-domain or not.

@taralx
Copy link

taralx commented Jun 1, 2013

If rails is depending on a non-standard header to determine the correct output format, I would argue that it is rails that needs changing.

+1 on documenting that this header is not added by default, though.

@dturkenk
Copy link

dturkenk commented Jun 1, 2013

I'm relatively new to Rails, so I could be wrong on this, but it looks like if you want to support rendering both HTML and JSON from the same route, the two ways to get it to return JSON are to make an Ajax request (with the X-Requested-With header) or to include "format=json" as a parameter.

Looks like jquery includes this header by default, so that's why Rails decided to make it a shortcut.

That said, adding the documentation is probably sufficient, and some of the Rails/Angular integration gems can add it if they want to make it easier.

@mazhekin
Copy link

 myApp.config(['$httpProvider', function ($httpProvider) {
    $httpProvider.defaults.useXDomain = true;
    delete $httpProvider.defaults.headers.common['X-Requested-With'];
 }]);

 $http.defaults.useXDomain = true;

 $http.get('http://ajax.googleapis.com/ajax/services/search/web?v=1.0&q=asp+site:codehint.ru').
        success(
            function (data, status, headers, config) {
                alert('answer');
            }
        );

Is not working! Because: Origin http://localhost:4157 is not allowed by Access-Control-Allow-Origin.

I have just started using angularjs an forced to use $.getJSON because it is working fine in situation above.Can anybody show me the right solution of code above to make ajax call to outer services like google.

@stodd
Copy link

stodd commented Sep 5, 2013

This change breaks some authentication logic on the server side of our app. We were relying on X-Requested-With to determine if a request is an ajax request or a regular request. We are now relying on application/json in the Accept header unless there is a better way for requests from Angular.

@sallespro
Copy link

hi,

i have tried deleting the X-Requested-With header but it still does not work with Koa backend.

    $httpProvider.defaults.useXDomain = true;
    delete $httpProvider.defaults.headers.common['X-Requested-With'];

what's wrong ?

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

drop X-Requested-With header from the default $http config